<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="HandheldFriendly" content="true" />
    <meta name="MobileOptimized" content="320" />
    <link rel="stylesheet" type="text/css" href="css/reset.css"/>
    <link rel="stylesheet" href="./css/jiazai.css">
    <link rel="stylesheet" type="text/css" href="css/animate.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <style type="text/css">
    	#com-tit{
			position: fixed;
			top: 0;
			right: 0;
			left: 0;
			z-index: 100;
			padding: 20px 20px 10px;
			background: #1e618a;
			color: white;
		}
		
		#com-tit>div:nth-of-type(1){
			flex: 0 0 80px;
			height: 30px;
			width: 100%;
		}
		.menu{
			width: 50px;
			height: 100%;
		}
		#com-tit>div:nth-of-type(2){
			flex: 1 1 0;
			font-size: 18px;
			text-align: center;
			color: white;
			width: 100%;
			
		}
		#com-tit>div:nth-of-type(3){
			flex: 0 0 80px;
			width: 100%;
			font-size: 14px;
			text-align: right;
		}
		#content-wrap{
			position: relative;
			margin-top: 60px;
		}
		.all-money{
			position: absolute;
			top: 70px;
			right: 20px;
			left: 20px;
			height: 135px;
			background: #1D618A;
			box-shadow: 0 0 10px #0C517A;
		}
		.money-tit-line{
			padding: 15px;
			font-size: 18px;
			color: white;
		}
		.money-tit-line>img{
			width: 90px;
			height: auto;
		}
		.money-show{
			align-items: flex-end;
		}
		.money-show>span:first-of-type{
			font-size: 30px;
			color: white;
		}
		.money-show>span:last-of-type{
			margin-left: 5px;
			font-size: 16px;
			color: rgba(255,255,255,.5);
		}
		.cny-money{
			padding-top: 5px;
			font-size: 20px;
			text-align: center;
			color: rgba(255,255,255,.6);
		}
		.controll-list{
			margin-top: 100px;
		}
		.controll-list img{
			width: 100px;
			height: 100px;
		}
		.controll-list>div>div{
			flex: 1 1 0;
			padding: 20px;
			flex-direction: column;
		}
		.controll-list>div>div>span{
			padding-top: 8px;
			font-weight: 600;
			color: #1D618A;
		}
		.controll-1{
			border-bottom: 1px solid rgba(29, 97, 138, .2);
		}
		.controll-1>div:first-of-type,.controll-2>div:first-of-type{
			border-right: 1px solid rgba(29, 97, 138, .2);
		}
    </style>
    <title>版本更新</title>
</head>

<body>
    <div id='app'>

        <!-- 加载中动画 -->
        <div id='jiazai-ani' v-if='jiazai'>
            <div class="arc"></div>
            <h1><span>LOADING</span></h1>
        </div>
        <!-- 加载中动画 -->
        
        <div id="com-tit" class='dis-spa'>
        	<div class='cont'>
        		<p class='menu dis-start' @tap="_close();">
	        		<img src="img/back-white.svg" style="width: 22px;height: 22px;" />
        		</p>
        	</div>
        	<div>挖矿</div>
        	<div class='cont'><img src="img/why.svg" style="width: 27px;height: auto;opacity: 0;"/></div>
        </div>
        
        <div id="content-wrap">
        	<div class="">
        		<img src="img/wakuang-bg.jpg" style="width: 100%;height: auto;"/>
        	</div>
        	<div class="all-money">
        		<div class="dis-spa money-tit-line">
        			<img src="img/line-left.png"/>
        			<span>USDT余额</span>
        			<img src="img/line-right.png"/>
        		</div>
        		<h4 class='dis-cen money-show'><span v-text='balance.toFixed(2)'>0.00</span><span>USDT</span></h4>
				<p class='cny-money'>≈￥{{(balance*price).toFixed(2)}}</p>
        	</div>
        	<div style="padding: 0 20px;margin-bottom: 50px;">
        		<div class="controll-list">
					<div class="dis-spa controll-1">
						<div class='dis-cen' @tap="importApi">
							<img src="img/import-api.png"/>
							<span>导入API</span>
						</div>
						<div class='dis-cen' @tap="goWa">
							<img src="img/wakuang.png"/>
							<span>一键挖矿</span>
						</div>
					</div>
					<div class="dis-spa controll-2">
						<div class='dis-cen' @tap="profit">
							<img src="img/shouyi.png"/>
							<span>收益查询</span>
						</div>
						<div class='dis-cen' @tap="_openHref({url:'history.html',id:'history'})">
							<img src="img/history.png"/>
							<span>历史记录</span>
						</div>
					</div>
				</div>
        	</div>
			
        </div>
    </div>
    <script src="js/comm.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vue.min.js"></script>
    <script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
    	//绑定api后回来刷新 我也不知道为什么要刷新
    	var update=function(){
    		app.getUserData();
    	};
        var app = new Vue({
            el: '#app',
            data: {
                //加载动画
                jiazai: false,
                //用户余额
                balance:0,
                //汇率
                price:0
            },
            created: function() {
            	this.getUserData();
            },
            methods: {
            	//导入api
            	importApi:function(){
            		var This=this;
            		function imp(){
            			//还没绑定交易所
            			var op = {
					        'backButtonAutoControl': 'close', //返回是关闭当前页
					        'animationOptimization': 'none', //不优化
					        popGesture: 'close'
					    };
					    This.jiazai = true;
					    var web = plus.webview.create('import-api.html', 'importApi', op);
					    web.addEventListener("loaded", function() {
					        setTimeout(function() {
					            This.jiazai = false;
					            web.show('slide-in-right');
					        }, 200);
					    }, false);
            		}
            		var isbindApi=JSON.parse(localStorage.getItem('ai_user')).isbindApi;
            		if(isbindApi){
            			//已经绑定过交易所了
	                   plus.nativeUI.confirm('确认要重新导入API吗？', function(ev) {
	                       if (ev.index == 0) {
	                           imp();
	                       }
	                   });
            		}else{
            			imp();
            		}
            	},
            	//得到用户余额
            	getUserData:function(){   
        			var This=this;
            		This.jiazai=true;
            		HTTP.post(GETBAN,{},function(data){
            			This.jiazai=false;
            			if(String(data.status)=='1'){
							This.balance=data.balance;
							This.price=data.price?data.price:0;
            			}else{
            				_toast(data.msg);
            				setTimeout(function(){
            					_close();
            				},1500);
            			}
					});
            	},
            	//一键挖矿
            	goWa:function(){
            		_openHref({
            			url:'go-wakuang.html',
            			id:'goWakuang'
            		});
            	},
            	//收益查询
            	profit:function(){
            		_openHref({
            			url:'profit.html',
            			id:'profit'
            		});
            	},
            	//去登录
            	goLogin:function(){
            		var op = {
				        'backButtonAutoControl': 'close', //返回是关闭当前页
				        'animationOptimization': 'none', //不优化
				    };
				    this.jiazai = true;
				    var This=this;
				    var web = plus.webview.create('login.html', 'login', op);
				    web.addEventListener("loaded", function() {
				        setTimeout(function() {
				            This.jiazai = false;
				            web.show('slide-in-right');
				        }, 200);
				    }, false);
            	},
            }
        });
       
    </script>
</body>

</html>